<template>
  <div>
    <h4>商品-sk2</h4>
    <!-- v-model =>  默认  :value   @input="msg=$event.target.msg" -->
    <!-- <number-box :value="count" @input="count=$event"></number-box> -->
    <!-- <number-box :value="count" @input="handleInput"></number-box> -->
    <!-- 通过语法糖来使用比较方便其他人来使用组件 -->
    <number-box v-model="count"></number-box> 
  </div>
</template>

<script>
// 1. 数字是给父组件用的 (通过父传子穿进去)
// 2. 子组件核心是修改数量
// 3. 子传父在父组件中进行修改
import NumberBox from './components/number-box.vue'
export default {
  components: {
    NumberBox
  },
  data() {
    return {
      count: 5
    }
  },
  methods: {
    handleInput(count) {
      this.count = count
      alert('哈哈哈')
    }
  }
}
</script>

<style>

</style>